import { connect } from 'dva'

import { orgDisabledApi } from '@/api/app'
import AekButton from '@/components/AekButton'
import AekLinkButton from '@/components/AekLinkButton'
import AekTable from '@/components/AekTable'
import PageLayout from '@/components/PageLayout'
import { namespace } from '@/models/sys/hospitalManagement'
import { getPagination, message, modal } from '@/utils/antdHelper'
import { getBasicFn } from '@/utils/dvaUtil/index'
import { requestWithTry } from '@/utils/request'

import ChangeModal from './components/ChangeModal'
import EditDrawer from './components/EditDrawer'

/** 系统 - 机构管理 */
const Index = ({ modelState, loading }) => {
  const { pageList, pagination } = modelState
  const { toAction, getLoading } = getBasicFn({ namespace, loading })

  const add = async () => {
    await EditDrawer.PromiseThen()
    message.success('新增成功')
    toAction('getPageList')
  }

  const edit = async row => {
    await EditDrawer.PromiseThen({
      row,
    })
    message.success('修改成功')
    toAction('getPageList')
  }

  const enable = async ({ organizationId }) => {
    await requestWithTry(orgDisabledApi, { organizationId })
    message.success('启用成功')
    toAction('getPageList')
  }

  const disable = ({ organizationName, organizationId }) => {
    modal.confirm({
      title: `是否确认停用机构【${organizationName}】？`,
      onOk: async () => {
        await requestWithTry(orgDisabledApi, { organizationId })
        message.success('停用成功')
        toAction('getPageList')
      },
    })
  }

  const change = async ({ organizationId }) => {
    await ChangeModal.PromiseThen({
      row: { organizationId },
    })
    message.success('修改成功')
    toAction('getPageList')
  }

  /** @type {import("@/components/AekTable").AekTableProps} */
  const tableProps = {
    configKey: namespace,
    rowKey: 'organizationId',
    loading: getLoading('getPageList'),
    dataSource: pageList,
    pagination: getPagination(pagination, (current, pageSize) => {
      toAction('getPageList', { current, pageSize })
    }),
    columns: [
      { dataIndex: 'organizationName', title: '机构名称' },
      { dataIndex: 'typeName', title: '类型' },
      { dataIndex: 'address', title: '地址', ellipsis: true },
      { dataIndex: 'userName', title: '管理员账号' },
      { dataIndex: 'createTime', title: '创建时间', isDateTime: true },
      {
        key: 'operate',
        title: '操作',
        fixed: 'right',
        width: 200,
        className: 'text-center!',
        render: (_, row) => (
          <>
            <AekLinkButton onClick={() => edit(row)}>编辑</AekLinkButton>
            <AekLinkButton onClick={() => change(row)}>修改密码</AekLinkButton>
            <AekLinkButton
              danger={!row.disabled}
              onClick={() => {
                !row.disabled ? disable(row) : enable(row)
              }}
            >
              {!row.disabled ? '停用' : '启用'}
            </AekLinkButton>
          </>
        ),
      },
    ],
  }

  return (
    <PageLayout
      extraSuffix={
        <AekButton type='primary' onClick={add}>
          新增机构
        </AekButton>
      }
    >
      <AekTable {...tableProps} />
    </PageLayout>
  )
}

export default connect(store => ({
  modelState: store[namespace],
  loading: store.loading,
}))(Index)
